import React from 'react';
import { Row, Col, Button, Form, message } from 'antd';
import FormItem from '../../../../components/FormItem';
import SingleFile from '../../../../components/Upload/SingleFile';
// import UploadFile from './uploadFile'
import services from '../../../../services/api';

function Step1(props) {
  // 上传
  function handleChange(data) {
  };
  function handleSubmit(e) {
    e.preventDefault();
    props.form.validateFields((err, values) => {
      if (!err) {
        props.getRule && props.getRule();
        const {strategy_file} = values;
        // const backData = {
        //   files: strategy_file,
        // };
        // props.setBackData(backData); // 回显用
        const formData = new FormData();
        formData.append('strategy_template_file', strategy_file.file);
        services.template.uploadFiles(formData).then(res => {
          if (!res.code) {
            props.setSubmitData && props.setSubmitData(res.data);
            props.goto && props.goto();
          } else {
            message.error(res.msg);  
          }
        });
        // services[props.type].importConfirm(params).then(res => { 
        //   if (!res.code) {
        //     props.setSubmitData && props.setSubmitData(res.data);
        //     props.goto && props.goto();
        //   } else {
        //     message.error(res.msg);
        //   }
        // }).catch(err => {
        //   message.error(err);
        // })
      };
    });
  };
  const formItems1 = [
    {
      label: {
        label: '文件上传',
        extra: '格式后缀为.txt的文件'
      },
      name: 'strategy_file',
      options: {
        initialValue: props.files,
        rules: [{ required: true, message: '请选择要导入的文件' }]
      },
      component: <SingleFile onChange={handleChange} />
    }
  ];
  return (
    <div className='tantuer'>
      <div className='tantuer-form'>
        <Form onSubmit={() => false} className='login-form'>
          <div className='strategy-operater-content'>
            <div style={{ width: '60%', margin: '20px auto 0 auto' }}>
              <Row type='flex' key={1}>
                {formItems1.map(item => {
                  return (
                    <Col span={12} key={item.name}>
                      <FormItem form={props.form} item={item} colNum={1} />
                    </Col>
                  );
                })}
              </Row>
            </div>
            <div className='strategy-template-ft'>
              <Row type='flex' justify='center' key={2}>
                <Col span={12} style={{ textAlign: 'center' }}>
                  <Button type='primary' onClick={handleSubmit}>
                    下一步
                  </Button>
                </Col>
              </Row>
            </div>
          </div>
        </Form>
      </div>
    </div>
  );
}

export default Form.create()(Step1);
